<!--
 * @Author: lmk
 * @Date: 2021-11-24 15:03:13
 * @LastEditTime: 2021-12-02 21:35:35
 * @LastEditors: lmk
 * @Description: 
-->
<template>
	<view class="form-box" :class="currentTheme" :style="{backgroundPosition:`100% ${barHeight}px`}">
		<a-nabbar name="注册登录" isCustomBack @customBack="customBack"  @getNavHeight="getNavHeight"/>
		<view class="welcome" :style="{top:`${barHeight+52}px`}">
			<image
				src="https://larp-gbo.oss-cn-chengdu.aliyuncs.com/larp/common-light/b77aeff3d59a45b6b96cd2e8dddbd8c0.png">
			</image>
		</view>
		<view class="buttons">
			<view class="u-padding-bottom-32 btn-view">
				<item-btn  @click="goPath('login')" height="88"  width="582">
					<text class="u-font-28">登录</text>
				</item-btn>
			</view>
			<view class=" btn-view">
				<item-btn  @click="goPath('register')" height="88" type="plain"  width="582">
					<text class="u-font-28">注册</text>
				</item-btn>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				barHeight: 0
			};
		},
		methods: {
			//动态获取导航栏高度
			getNavHeight(res){
				this.barHeight = res.navbarHeight + res.statusBarHeight
			},
			goPath(type) {
				this.$u.route({
					url:"/pagesA/login/login",
					params:{
						type
					}
				})
			},
			customBack(){
				this.$u.route({
					type:"reLaunch",
					url:"/pages/index/index"
				})
			}
		},
	}
</script>

<style lang="scss" scoped>
.box{
	padding-top: 270rpx;
}
.buttons{
		position: fixed;
		bottom: 200rpx;
		left: 50vw;
		transform: translateX(-290rpx);
}
	.welcome {
		// position: fixed;
		// left: 50rpx;
		width: 466rpx;
		height: 290rpx;
		margin: 100rpx 0 145rpx 50rpx;
		image {
			width: 100%;
			height: 100%;
		}
	}
	.field-box {
		padding:0 85rpx ;
	}
	.form-box {
		background-image: url('https://larp-gbo.oss-cn-chengdu.aliyuncs.com/larp/common-light/c11f61b563e347beb20eed2317afb61e.png');
		background-size: (49 / 75)*100vw (49 / 75)*100vw * (65/49);
		background-repeat: no-repeat;
	}
	.btn-view{
    margin: auto;
    width: 290px;
	}
</style>
